<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>login</title>
    <link href="css/login.css" rel="stylesheet">
</head>

<body>

<div id="loginDiv" style="height: 450px">
    <form action="/ChenXufeng_Fengchao_System/LoginServlet" id="form" @submit.prevent="submitForm">
        <p>Username:<input id="username" name="username" v-model="username" type="text"></p>

        <p>Password:<input id="password" name="password" v-model="password" type="password"></p>

        <p>Remember:<input id="remember" name="remember" VALUE="1" type="checkbox" v-model="remember"></p>
        <p v-if="loginMessage">{{ loginMessage }}</p>
        <div id="subDiv">
            <input type="submit" class="button" value="login up">
            <input type="reset" class="button" value="reset">
            <a href="register.html">没有账号？</a>
            <a href="mailCode.html">忘记密码</a>
        </div>
    </form>
</div>
<script src="js/vue.js"></script>
<script src="element-ui/lib/index.js"></script>
<link rel="stylesheet" href="element-ui/lib/theme-chalk/index.css">
<script src="js/axios-0.18.0.js"></script>
<script>
    new Vue({
        el: '#loginDiv',
        data: {
            username: '',
            password: '',
            remember: false,
            loginMessage: '',
        },
        mounted() {
            // 获取cookie中的用户名和密码
            const usernameCookie = this.getCookie('username');
            const passwordCookie = this.getCookie('password');
            const rememberCookie = this.getCookie('remember');

            // 如果cookie中有用户名和密码，则填充到表单中
            if (usernameCookie && passwordCookie) {
                this.username = usernameCookie;
                this.password = passwordCookie;

            }
            if(rememberCookie){
                this.remember=rememberCookie;
            }
        },
        methods: {
            submitForm() {
                var _this=this
                console.log(this.remember)
                axios({
                    method:"post",
                    url: "http://localhost:8080/ChenXufeng_Fengchao_System/LoginServlet?username="+_this.username+"&password="+_this.password+"&remember="+_this.remember,

                    data:_this.data,
                }).then(resp => {
                    window.location.href = resp.data;
                })
                // 在这里提交表单
                // 可以通过this.username 和 this.password 获取用户名和密码
            },
            getCookie(name) {
                const cookieName = name + '=';
                const cookies = document.cookie.split(';');
                for (let i = 0; i < cookies.length; i++) {
                    let cookie = cookies[i].trim();
                    if (cookie.indexOf(cookieName) === 0) {
                        return cookie.substring(cookieName.length, cookie.length);
                    }
                }
                return '';
            }
        }
    });
</script>

</body>
</html>